<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<%
String path = request.getContextPath();
String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
	<head>
		<base href="<%=basePath%>"/>
		<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
		<title>总店采购审核</title>
		<link rel="stylesheet" href="res/layui/css/layui.css">
		<script src="res/js/jquery-2.1.4.min.js" type="text/javascript" ></script>
		<script src="res/layui/layui.js"></script>
		<style type="text/css">
			tbody [data-field=PROLIST_DPCOUNT]:HOVER {
				background-color: #fff;
				cursor:pointer;
			}
		</style>
	</head>
	<body>
		<div style="margin-bottom: 5px;">
			金额区间：
			<div class="layui-inline">
				<input type="text" class="layui-input" id="minMoney" placeholder="起始金额">
			</div>
			~
			<div class="layui-inline">
				<input type="text" class="layui-input" id="maxMoney" placeholder="结束金额">
			</div>
		</div>
		<div>
			时间区间：
			<div class="layui-inline">
				<input type="text" class="layui-input" id="startTime" placeholder="开始时间">
			</div>
			~
			<div class="layui-inline">
				<input type="text" class="layui-input" id="endTime" placeholder="结束时间">
			</div>
			<button class="layui-btn" data-type="reload" onclick="reloadData()">搜索</button>
		</div>
		<table class="layui-table" id="ruku" lay-filter="demo"></table> 
		
		<script type="text/html" id="type">
			{{# if(d.PACT_TYPE==1){ }}
				<span class="layui-btn-normal layui-btn-xs" style="color:#fff;padding:4px;">成品</span>
			{{#	}else{ }}
				<span class="layui-btn-warm layui-btn-xs" style="color:#fff;padding:4px;">原料</span>
			{{# } }}
		</script>
		
		<script type="text/html" id="state">
			{{# if(d.PROLIST_state==0){ }}
				<span class="layui-badge layui-bg-gray">未审核</span>
			{{#	}else if(d.PROLIST_state==1){ }}
				<span class="layui-badge layui-bg-orange">等待总经理审核</span>
			{{# }else if(d.PROLIST_state==2){ }}
				<span class="layui-badge layui-bg-blue">通过审核</span>
			{{# }else if(d.PROLIST_state==3){ }}
				<span class="layui-badge">打回</span>
			{{# } }}
		</script>
		
		<script type="text/html" id="time">
			{{ (new Date(d.PROLIST_TIME)).Format("yyyy-MM-dd hh:mm:ss") }} 
		</script>
		
		<script type="text/html" id="demo">
            {{# if(d.PROLIST_state==0 || d.PROLIST_state==1){ }}
           		<a class="layui-btn layui-btn-mini layui-btn-xs" lay-event="edit">审核</a>
				<a class="layui-btn layui-btn-warm layui-btn-xs" lay-event="detail">查看审核进度</a>
			{{# }else{ }}
				<a class="layui-btn layui-btn-warm layui-btn-xs" lay-event="detail">查看审核记录</a>
			{{# } }}
            <a class="layui-btn layui-btn-danger layui-btn-xs" lay-event="del">查看详情</a>
		</script>
		
		<script type="text/javascript">
		var table;

		var loadIndex;

		var openIndex;
		
		var laydate;
		
		//角色名
		var roleName;
		
		function fack(){
			$.ajax({
				type : "POST",
				url : "exam/findRoleByStaffId.action",
				data : {"staffId":"${staff.staffId }"},
				error : function(){
					
				},
				success : function(info){
					info = getCharFromUtf8(info);
					roleName = info;
				}
			});
		}
		
		/**
			搜索
		*/
		function reloadData(){
			table.reload('ZPurchase', {
				where : {
					"startTime" : $("#startTime").val(),
					"endTime" : $("#endTime").val()==""?"2099-12-31 ":$("#endTime").val()+" 23:59:59",
					"maxMoney" : $("#maxMoney").val(),
					"minMoney" : $("#minMoney").val()
				}
			});
		}
		
		function sk(entryId, proType){
			layer.open({
				type : 2//样式
				,
				skin : 'layui-layer-molv'//样式
				,
				area : [ '85%', '70%' ],
				title : "部门维护"//标题
				,
				id : 'mesFrom' //防止重复弹出
				,
				content : 'pages/SH/shenhe.jsp?entryId='+entryId+'&proType='+proType+'&skType=2',
				shade : [ 0.8, '#393D49' ] //显示遮罩
				,
				shadeClose : true//点击也能遮罩层关闭
				,
				anim : 2
			//弹出动画 
			});
		}
		
		/**
			查看审核情况
		*/
		function information(entryId){
			openIndex = layer.open({
				type : 2//样式
				,
				skin : 'layui-layer-molv'//样式
				,
				area : [ '50%', '70%' ],
				title : "审核记录"//标题
				,
				id : 'queryExam' //防止重复弹出
				,
				content : 'pages/SH/queryExam.jsp?entryId='+entryId,
				shade : [ 0.8, '#393D49' ] //显示遮罩 
				,
				shadeClose : true//点击也能遮罩层关闭
				,
				anim : 2
			//弹出动画 
			});
		}
		
		/**
			查看详情
		*/
		function checkMsg(type, prolistId){
			var url = 'exam/findCaiGById.action';
			$.post(url,{"prolistId" : prolistId,"proType":type},function(info) {
				
				var tablestr = '<table style="width:80%;margin:auto;margin-top:40px;margin-bottom:40px;" class="layui-table"><thead><tr><th align="center">名称</th><th>数量</th><th>小计</th></tr></thead><tbody>';
				
				for(i=0; i<info.length; i++){
					var obj = info[i];
					if(type==1){
						tablestr += '<tr><td>'+obj.WARE_NAME+'</td><td>'+obj.PROLISTMX_COUNT+'</td><td>'+obj.PROLISTMX_MONEY+'</td>';
					}else{
						tablestr += '<tr><td>'+obj.DOS_NAME+'</td><td>'+obj.DOSING_PROLISTMX_COUNT+'</td><td>'+obj.DOSING_PROLISTMX_MONEY+'</td>';
					}
				}
				tablestr += '</tbody></table>';
				layer.open({
					type : 1//样式
					,
					skin : 'layui-layer-molv'//样式
					,
					area : [ '60%'],
					title : "详情"//标题
					,
					id : 'xq' //防止重复弹出
					,
					content : tablestr,
					shade : [ 0.8, '#393D49' ] //显示遮罩
					,
					shadeClose : true//点击也能遮罩层关闭
					,
					anim : 2
				//弹出动画 
				});
			});
		}

		layui.use(['table','laydate'], function() {

			table = layui.table;
			loadIndex = layer.load();
			//方法级渲染
			table.render({
				loading : true,
				id : 'ZPurchase',
				page : true,
				height : 383,
				size : "sm",
				elem : '#ruku',
				url : 'exam/showZPurchase.action',
				method : 'post',
				where : {

				},
				cols : [ [ {
					field : 'PACT_TYPE',
					title : '采购类型',
					width : 80,
					align : 'center',
					templet : '#type'
				}, {
					field : 'STAFF_NAME',
					title : '采购人',
					width : 70,
					align : 'center',
				}, {
					field : 'PROLIST_DPCOUNT',
					title : '数量',
					width : 60,
					align : 'center',
				}, {
					field : 'PROLIST_money',
					title : '总金额',
					width : 70,
					align : 'center',
				}, {//PROLIST_TIME
					field : 'PROLIST_TIME',
					title : '时间',
					width : 150,
					align : 'center',
					templet : '#time'
				},{
					field : 'PROLIST_state',
					title : '审核状态',
					width : 120,
					align : 'center',
					templet : '#state'
				}, {
					fixed : 'right',
					width : 240,
					align : 'center',
					toolbar : '#demo'
				} ] ]
				,
				done : function(res, curr, count) {
					layer.close(loadIndex);//加载层关闭  
					fack();
					$("tbody [data-field=PROLIST_DPCOUNT]").on("click",function() {
						var type = res.data[$(this).parent()[0].rowIndex].PACT_TYPE;
						var prolistId = res.data[$(this).parent()[0].rowIndex].PROLIST_ID;
						checkMsg(type, prolistId);
					});
				}
			});

			//监听工具条
			table.on('tool(demo)',function(obj) {
				var data = obj.data;
				if(obj.event === 'detail'){
					if(data.PROLIST_state!=0){
						information(data.PROLIST_ID);//查询审核情况的方法
					}else{
						layer.msg('等待审核',{icon: 5,anim: 6});
					}
				}else if(obj.event === 'del') {
					checkMsg(data.PACT_TYPE, data.PROLIST_ID);
				} else if (obj.event === 'edit') {
					if("总店财务"==roleName && data.PROLIST_state==1){
						layer.msg('财务已经审核过了，无序重复审核',{icon: 5,anim: 6});
					}else if("总店财务"==roleName && data.PROLIST_state==0){
						sk(data.PROLIST_ID, data.PACT_TYPE);
					}else if("总店经理"==roleName && data.PROLIST_state==0){
						layer.msg('等待财务审核',{icon: 5,anim: 6});
					}else if("总店经理"==roleName && data.PROLIST_state==1){
						sk(data.PROLIST_ID, data.PACT_TYPE);
					}else{
						layer.msg('当前登录的账号暂无审核权限',{icon: 5,anim: 6});
					}
				}
			});
			
			laydate = layui.laydate;
		 	//选中后的回调
		  	var startTime = laydate.render({
			    elem: '#startTime',
			    done: function(value, date){
			    	if(value!=''){
			    		endTime.config.min.year = date.year;
			    		endTime.config.min.month = date.month - 1;
			    		endTime.config.min.date = date.date;
					}else{
						endTime.config.min.year = '1900';
						endTime.config.min.month = '01';
						endTime.config.min.date = '01';
					}
			    }
		    });
		 	
		 	var endTime = laydate.render({
		 		elem: '#endTime',
		 		done: function(value, date){
		 			if(value!=''){
		 				startTime.config.max.year = date.year;
		 				startTime.config.max.month = date.month - 1;
		 				startTime.config.max.date = date.date;
					}else{
						startTime.config.max.year = '2099';
						startTime.config.max.month = '12';
						startTime.config.max.date = '31';
					}
		 		}
		 	});

			$('.demoTable .layui-btn').on('click',function() {
				var type = $(this).data('type');
				active[type] ? active[type].call(this) : '';
			});
		});
		</script>
		<script type="text/javascript">
		function utf8ToChar(str) {  
		    var iCode, iCode1, iCode2;  
		    iCode = parseInt("0x" + str.substr(1, 2));  
		    iCode1 = parseInt("0x" + str.substr(4, 2));  
		    iCode2 = parseInt("0x" + str.substr(7, 2));  
		    return String.fromCharCode(((iCode & 0x0F) << 12) | ((iCode1 & 0x3F) << 6) | (iCode2 & 0x3F));  
		}  
		
		function getCharFromUtf8(str) {  
		    var cstr = "";  
		    var nOffset = 0;  
		    if (str == "")  
		        return "";  
		    str = str.toLowerCase();  
		    nOffset = str.indexOf("%e");  
		    if (nOffset == -1)  
		        return str;  
		    while (nOffset != -1) {  
		        cstr += str.substr(0, nOffset);  
		        str = str.substr(nOffset, str.length - nOffset);  
		        if (str == "" || str.length < 9)  
		            return cstr;  
		        cstr += utf8ToChar(str.substr(0, 9));  
		        str = str.substr(9, str.length - 9);  
		        nOffset = str.indexOf("%e");  
		    }  
		    return cstr + str;  
		}
		/**
			格式化日期
		*/
		Date.prototype.Format = function (fmt) { //author: meizz 
		    var o = {
		        "M+": this.getMonth() + 1, //月份 
		        "d+": this.getDate(), //日 
		        "h+": this.getHours(), //小时 
		        "m+": this.getMinutes(), //分 
		        "s+": this.getSeconds(), //秒 
		        "q+": Math.floor((this.getMonth() + 3) / 3), //季度 
		        "S": this.getMilliseconds() //毫秒 
		    };
		    if (/(y+)/.test(fmt)) fmt = fmt.replace(RegExp.$1, (this.getFullYear() + "").substr(4 - RegExp.$1.length));
		    for (var k in o)
		    if (new RegExp("(" + k + ")").test(fmt)) fmt = fmt.replace(RegExp.$1, (RegExp.$1.length == 1) ? (o[k]) : (("00" + o[k]).substr(("" + o[k]).length)));
		    return fmt;
		} 
		</script>
	</body>
</html>